<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org" th:replace="layout/admin">
<div th:fragment="home-content">
    <!-- 内容区域 -->
    <div class="content-wrapper">

        <!-- 内容头部 -->
        <section class="content-header">
            <h1>
                用户管理
                <small>用户列表</small>
            </h1>
            <ol class="breadcrumb">
                <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
                <li><a href="#">用户</a></li>
                <li class="active">所有用户</li>
            </ol>
        </section>
        <!-- 内容头部 /-->

        <!-- 正文区域 -->
        <section class="content">

            <!-- .box-body -->
            <div class="box box-primary">
                <div class="box-header with-border">
                    <h3 class="box-title">列表</h3>
                </div>

                <div class="box-body">

                    <!-- 数据表格 -->
                    <div class="table-box">

                        <!--工具栏-->
                        <div class="pull-left">
                            <div class="form-group form-inline">
                                <div class="btn-group">
                                    <button type="button" class="btn btn-default" title="添加" onclick='location.href="add"'><i class="fa fa-fa-user-plus"></i> 添加</button>
                                    <button type="button" class="btn btn-default" title="删除" data-toggle="modal" data-target="#modal-delete"><i class="fa fa-user-times"></i> 删除</button>
                                    <button type="button" class="btn btn-default" title="启用" data-toggle="modal" data-target="#modal-enabled"><i class="fa fa-user"></i> 启用</button>
                                    <button type="button" class="btn btn-default" title="屏蔽" data-toggle="modal" data-target="#modal-ban"><i class="fa fa-ban"></i> 屏蔽</button>
                                    <button type="button" class="btn btn-default" title="刷新" id="refresh"><i class="fa fa-refresh"></i> 刷新</button>
                                </div>

                                <div class="modal modal-danger fade" id="modal-delete">
                                    <div class="modal-dialog">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                    <span aria-hidden="true">&times;</span></button>
                                                <h4 class="modal-title">删除用户</h4>
                                            </div>
                                            <div class="modal-body">
                                                <p>确定删除用户吗?</p>
                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-outline pull-left" data-dismiss="modal">关闭</button>
                                                <button type="button" class="btn btn-outline">确定</button>
                                            </div>
                                        </div>
                                        <!-- /.modal-content -->
                                    </div>
                                    <!-- /.modal-dialog -->
                                </div>

                                <div class="modal fade" id="modal-enabled">
                                    <div class="modal-dialog">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                    <span aria-hidden="true">&times;</span></button>
                                                <h4 class="modal-title">启用用户</h4>
                                            </div>
                                            <div class="modal-body">
                                                <p>确定开启用户吗?</p>
                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-default pull-left" data-dismiss="modal">关闭</button>
                                                <button type="button" class="btn btn-primary">确定</button>
                                            </div>
                                        </div>
                                        <!-- /.modal-content -->
                                    </div>
                                    <!-- /.modal-dialog -->
                                </div>
                                <!-- /.modal -->

                                <div class="modal modal-warning fade" id="modal-ban">
                                    <div class="modal-dialog">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                    <span aria-hidden="true">&times;</span></button>
                                                <h4 class="modal-title">禁用用户</h4>
                                            </div>
                                            <div class="modal-body">
                                                <p>确定禁用用户吗?</p>
                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-outline pull-left" data-dismiss="modal">关闭</button>
                                                <button type="button" class="btn btn-outline">确定</button>
                                            </div>
                                        </div>
                                        <!-- /.modal-content -->
                                    </div>
                                    <!-- /.modal-dialog -->
                                </div>
                                <!-- /.modal -->
                            </div>
                        </div>
                        <div class="box-tools pull-right">
                            <div class="has-feedback">
                                <input type="text" class="form-control input-sm" placeholder="搜索(区分大小写)" id="condition">
                                <span class="glyphicon glyphicon-search form-control-feedback"></span>
                            </div>
                        </div>
                        <!--工具栏/-->

                        <!--数据列表-->
                        <table id="dataList" class="table table-bordered table-striped table-hover dataTable">
                            <thead>
                            <tr>
                                <th class="" style="padding-right:0;">
                                    <input id="selall" type="checkbox" class="icheckbox_square-blue">
                                </th>
                                <th class="sorting">用户名</th>
                                <th class="sorting">注册时间</th>
                                <th>注册IP</th>

                                <th class="">邮箱</th>
                                <th class="">状态</th>

                                <th class="text-center">操作</th>
                            </tr>
                            </thead>
                            <tbody id="users">

                                <tr>
                                    <td><input name="ids" type="checkbox"></td>
                                    <td>${user.username}</td>
                                    <td>${user.registertime}</td>
                                    <td>${user.ip}</td>

                                    <td>${user.email}</td>
                                    <td>
                                        正常
                                    </td>

                                    <td class="text-center">
                                        <button type="button" class="btn btn-xs bg-light-blue" onclick='location.href="${user.uid}"'><i class="fa fa-edit"></i> 详情</button>
                                        <button type="button" class="btn btn-danger btn-xs" onclick='location.href="#"'><i class="fa fa-close"></i> 删除</button>
                                    </td>
                                </tr>

                            </tbody>
                        </table>
                        <!--数据列表/-->

                    </div>
                    <!-- 数据表格 /-->

                </div>
                <!-- /.box-body -->

                <!-- .box-footer-->
                <div class="box-footer">
                    <div class="pull-left">
                        <div class="form-group form-inline">
                            总共2 页，共14 条数据。 每页
                            <select class="form-control">
                                <option>10</option>
                                <option>15</option>
                                <option>20</option>
                                <option>50</option>
                                <option>80</option>
                            </select> 条
                        </div>
                    </div>

                    <div class="box-tools pull-right">
                        <ul class="pagination">
                            <li>
                                <a href="#" aria-label="Previous">首页</a>
                            </li>
                            <li><a href="#">上一页</a></li>
                            <li><a href="#">1</a></li>
                            <li><a href="#">2</a></li>
                            <li><a href="#">3</a></li>
                            <li><a href="#">4</a></li>
                            <li><a href="#">5</a></li>
                            <li><a href="#">下一页</a></li>
                            <li>
                                <a href="#" aria-label="Next">尾页</a>
                            </li>
                        </ul>
                    </div>

                </div>
                <!-- /.box-footer-->


            </div>

        </section>
        <!-- 正文区域 /-->

    </div>
    <!-- 内容区域 /-->
</div>
</html>